<template>
    <van-popup 
        :value="value" 
        :round="round" 
        :position="position" 
        :closeable="closeable"
        :close-icon="closeIcon" 
        :close-icon-position="closeIconPosition" 
        :style="popStyle"
        :close-on-click-overlay="closeOnClickOverlay"
        @open="open"
        @close="close" 
        @click="click"
        @click-overlay="closeOverlay"
        @input="val=>this.$emit('input',val)"
    >
        <div v-show="title" class="popup-title"><slot name="preTitle" />{{title}}<slot name="afterTitle"/></div>
        <div class="popup-content">
            <slot/>
        </div>
    </van-popup>
</template>
<script>
export default {
    name:"eagle-popup",
    props:{
        title:{
            type:String,
            default:'询问',
        },
        round:{
            type:Boolean,
            default:()=>false,
        },
        position:{
            type:String,
            default:'center',
        },
        closeable:{
            type:Boolean,
            default:()=>false,
        },
        closeIcon:{
            type:String,
            default:'cross',
        },
        closeIconPosition:{
            type:String,
            default:'top-right',
        },
        popStyle:{
            type:Object,
            default:()=>{}
        },
        value:{
            type:Boolean,
            default:false,
        },
        closeOnClickOverlay:{
            type:Boolean,
            default:true,
        }
    },
    data(){
        return {
            
        }
    },
    watch:{

    },
    computed:{
        
    },
    methods:{
        open(){
            this.$emit("open");
        },
        close(){
            this.$emit("close");
        },
        click(){
            this.$emit("click");
        },
        closeOverlay(){
            this.$emit("closeOverlay");
        }
    }
}
</script>